<div [class]="isCollapsed ? 'navbar' : 'active navbar'">
  <div [class]="isCollapsed ? 'logo' : 'big-logo logo'">
    <img (click)="toggleFn(true)" [hidden]="isCollapsed" src="//cdn.czbapp.com/czb/webssr/images/logo/logo.png" title="收起"
      alt="Czb">
    <img (click)="toggleFn(false)" [hidden]="!isCollapsed" src="../../../assets/images/logo_small.png" title="展开" alt="Czb">
  </div>

  <ul nz-menu [nzMode]="'inline'" nzTheme='dark' [nzInlineCollapsed]="isCollapsed">

    <ng-container *ngFor="let item of treeData">
      <li nz-menu-item nz-tooltip *ngIf="item.children.length === 0" [routerLink]="item.link"  nzPlacement="right" [nzTitle]="isCollapsed ? item.title : ''">
        <span title>
          <i nz-icon *ngIf="item.icon" [type]="item.icon" theme="outline"></i>
          <span>{{item.title}} {{item.icon}}</span>
        </span>
      </li>
      <li nz-submenu *ngIf="item.children.length !== 0">
        <span title>
          <i nz-icon *ngIf="item.icon" [type]="item.icon" theme="outline"></i>
          <span>{{item.title}}</span>
        </span>
        <app-menu-tree [data]="item.children"></app-menu-tree>
      </li>
    </ng-container>
  </ul>

</div>